<!DOCTYPE html>
<!--[if lt IE 7]> <html class="ie ie6 lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="ie ie7 lt-ie9 lt-ie8"        lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="ie ie8 lt-ie9"               lang="en"> <![endif]-->
<!--[if IE 9]>    <html class="ie ie9"                      lang="en"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en" class="no-ie">
<!--<![endif]-->

<head>
   <!-- Meta-->
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
   <meta name="description" content="">
   <meta name="keywords" content="">
   <meta name="author" content="">
   <title>BeAdmin - Bootstrap Admin Theme</title>
   <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
   <!--[if lt IE 9]><script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script><script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script><![endif]-->
   <!-- Bootstrap CSS-->
   <link rel="stylesheet" href="app/css/bootstrap.css">
   <!-- Vendor CSS-->
   <link rel="stylesheet" href="vendor/fontawesome/css/font-awesome.min.css">
   <link rel="stylesheet" href="vendor/animo/animate+animo.css">
   <link rel="stylesheet" href="vendor/csspinner/csspinner.min.css">
   <!-- START Page Custom CSS-->
   <!-- END Page Custom CSS-->
   <!-- App CSS-->
   <link rel="stylesheet" href="app/css/app.css">
   <!-- Modernizr JS Script-->
   <script src="vendor/modernizr/modernizr.js" type="application/javascript"></script>
   <!-- FastClick for mobiles-->
   <script src="vendor/fastclick/fastclick.js" type="application/javascript"></script>
</head>

<body>
   <!-- START Main wrapper-->
   <div class="wrapper">
      <!-- START Top Navbar-->
      <nav role="navigation" class="navbar navbar-default navbar-top navbar-fixed-top">
         <!-- START navbar header-->
         <div class="navbar-header">
            <a href="index.html" class="navbar-brand">
               <div class="brand-logo">
                  <img src="app/img/logo.png" alt="App Logo" class="img-responsive">
               </div>
               <div class="brand-logo-collapsed">
                  <img src="app/img/logo-single.png" alt="App Logo" class="img-responsive">
               </div>
            </a>
         </div>
         <!-- END navbar header-->
         <!-- START Nav wrapper-->
         <div class="nav-wrapper">
            <!-- START Left navbar-->
            <ul class="nav navbar-nav">
               <li>
                  <!-- Button used to collapse the left sidebar. Only visible on tablet and desktops-->
                  <a href="widgets.html#" data-toggle-state="aside-collapsed" class="hidden-xs">
                     <em class="fa fa-navicon"></em>
                  </a>
                  <!-- Button to show/hide the sidebar on mobile. Visible on mobile only.-->
                  <a href="widgets.html#" data-toggle-state="aside-toggled" class="visible-xs">
                     <em class="fa fa-navicon"></em>
                  </a>
               </li>
               <!-- START Messages menu (dropdown-list)-->
               <li class="dropdown dropdown-list">
                  <a href="widgets.html#" data-toggle="dropdown" data-play="flipInX" class="dropdown-toggle">
                     <em class="fa fa-envelope"></em>
                  </a>
                  <!-- START Dropdown menu-->
                  <ul class="dropdown-menu">
                     <li class="dropdown-menu-header">Unread messages</li>
                     <li class="p-sm">
                        <input type="text" placeholder="Find contacts.." onfocus="javascript:void(0);" class="form-control">
                     </li>
                     <li>
                        <div class="scroll-viewport">
                           <!-- START list group-->
                           <div class="list-group scroll-content">
                              <!-- START list group item-->
                              <a href="widgets.html#" class="list-group-item">
                                 <div class="media">
                                    <div class="pull-left">
                                       <img src="app/img/user/01.jpg" alt="Image" class="media-object img-circle thumb32">
                                    </div>
                                    <div class="media-body clearfix">
                                       <small class="pull-right">5m</small>
                                       <strong class="media-heading text-primary">
                                          <span class="circle circle-success circle-md"></span>Greg Lewis</strong>
                                       <p class="mb-sm">
                                          <small>Nunc vel dui et leo sagittis fringilla.</small>
                                       </p>
                                    </div>
                                 </div>
                              </a>
                              <!-- END list group item-->
                              <!-- START list group item-->
                              <a href="widgets.html#" class="list-group-item">
                                 <div class="media">
                                    <div class="pull-left">
                                       <img src="app/img/user/04.jpg" alt="Image" class="media-object img-circle thumb32">
                                    </div>
                                    <div class="media-body clearfix">
                                       <small class="pull-right">3h</small>
                                       <strong class="media-heading text-primary">
                                          <span class="circle circle-success circle-md"></span>Constance Cook</strong>
                                       <p class="mb-sm">
                                          <small>Nunc vel dui et leo sagittis fringilla.</small>
                                       </p>
                                    </div>
                                 </div>
                              </a>
                              <!-- END list group item-->
                              <!-- START list group item-->
                              <a href="widgets.html#" class="list-group-item">
                                 <div class="media">
                                    <div class="pull-left">
                                       <img src="app/img/user/03.jpg" alt="Image" class="media-object img-circle thumb32">
                                    </div>
                                    <div class="media-body clearfix">
                                       <small class="pull-right">3h</small>
                                       <strong class="media-heading text-primary">
                                          <span class="circle circle-danger circle-md"></span>Cody Barnes</strong>
                                       <p class="mb-sm">
                                          <small>Nunc vel dui et leo sagittis fringilla.</small>
                                       </p>
                                    </div>
                                 </div>
                              </a>
                              <!-- END list group item-->
                              <!-- START list group item-->
                              <a href="widgets.html#" class="list-group-item">
                                 <div class="media">
                                    <div class="pull-left">
                                       <img src="app/img/user/05.jpg" alt="Image" class="media-object img-circle thumb32">
                                    </div>
                                    <div class="media-body clearfix">
                                       <small class="pull-right">4h</small>
                                       <strong class="media-heading text-primary">
                                          <span class="circle circle-danger circle-md"></span>Gina Robinson</strong>
                                       <p class="mb-sm">
                                          <small>Nunc vel dui et leo sagittis fringilla.</small>
                                       </p>
                                    </div>
                                 </div>
                              </a>
                              <!-- END list group item-->
                              <!-- START list group item-->
                              <a href="widgets.html#" class="list-group-item">
                                 <div class="media">
                                    <div class="pull-left">
                                       <img src="app/img/user/06.jpg" alt="Image" class="media-object img-circle thumb32">
                                    </div>
                                    <div class="media-body clearfix">
                                       <small class="pull-right">yesterday</small>
                                       <strong class="media-heading text-primary">
                                          <span class="circle circle-danger circle-md"></span>Violet Olson</strong>
                                       <p class="mb-sm">
                                          <small>Nunc vel dui et leo sagittis fringilla.</small>
                                       </p>
                                    </div>
                                 </div>
                              </a>
                              <!-- END list group item-->
                           </div>
                           <!-- END list group-->
                        </div>
                     </li>
                     <!-- START dropdown footer-->
                     <li class="p">
                        <a href="widgets.html#" class="text-center">
                           <small class="text-primary">More messages</small>
                        </a>
                     </li>
                     <!-- END dropdown footer-->
                  </ul>
                  <!-- END Dropdown menu-->
               </li>
               <!-- END Messages menu (dropdown-list)-->
               <!-- START User avatar toggle-->
               <li>
                  <!-- Button used to collapse the left sidebar. Only visible on tablet and desktops-->
                  <a href="widgets.html#" data-toggle-state="aside-user">
                     <em class="fa fa-user"></em>
                  </a>
               </li>
               <!-- END User avatar toggle-->
            </ul>
            <!-- END Left navbar-->
            <!-- START Right Navbar-->
            <ul class="nav navbar-nav navbar-right">
               <!-- Search icon-->
               <li>
                  <a href="widgets.html#" data-toggle="navbar-search">
                     <em class="fa fa-search"></em>
                  </a>
               </li>
               <!-- Fullscreen-->
               <li>
                  <a href="widgets.html#" data-toggle="fullscreen">
                     <em class="fa fa-expand"></em>
                  </a>
               </li>
               <!-- START Alert menu-->
               <li class="dropdown dropdown-list">
                  <a href="widgets.html#" data-toggle="dropdown" data-play="flipInX" class="dropdown-toggle">
                     <em class="fa fa-bell"></em>
                     <div class="label label-danger">11</div>
                  </a>
                  <!-- START Dropdown menu-->
                  <ul class="dropdown-menu">
                     <li>
                        <!-- START list group-->
                        <div class="list-group">
                           <!-- list item-->
                           <a href="widgets.html#" class="list-group-item">
                              <div class="media">
                                 <div class="pull-left">
                                    <em class="fa fa-twitter fa-2x text-info"></em>
                                 </div>
                                 <div class="media-body clearfix">
                                    <p class="m0">New followers</p>
                                    <p class="m0 text-muted">
                                       <small>1 new follower</small>
                                    </p>
                                 </div>
                              </div>
                           </a>
                           <!-- list item-->
                           <a href="widgets.html#" class="list-group-item">
                              <div class="media">
                                 <div class="pull-left">
                                    <em class="fa fa-envelope fa-2x text-warning"></em>
                                 </div>
                                 <div class="media-body clearfix">
                                    <p class="m0">New e-mails</p>
                                    <p class="m0 text-muted">
                                       <small>You have 10 new emails</small>
                                    </p>
                                 </div>
                              </div>
                           </a>
                           <!-- list item-->
                           <a href="widgets.html#" class="list-group-item">
                              <div class="media">
                                 <div class="pull-left">
                                    <em class="fa fa-tasks fa-2x text-success"></em>
                                 </div>
                                 <div class="media-body clearfix">
                                    <p class="m0">Pending Tasks</p>
                                    <p class="m0 text-muted">
                                       <small>11 pending task</small>
                                    </p>
                                 </div>
                              </div>
                           </a>
                           <!-- last list item -->
                           <a href="widgets.html#" class="list-group-item">
                              <small>More notifications</small>
                              <span class="label label-danger pull-right">14</span>
                           </a>
                        </div>
                        <!-- END list group-->
                     </li>
                  </ul>
                  <!-- END Dropdown menu-->
               </li>
               <!-- END Alert menu-->
               <!-- START Contacts button-->
               <li>
                  <a href="widgets.html#" data-toggle-state="offsidebar-open">
                     <em class="fa fa-group"></em>
                  </a>
               </li>
               <!-- END Contacts menu-->
            </ul>
            <!-- END Right Navbar-->
         </div>
         <!-- END Nav wrapper-->
         <!-- START Search form-->
         <form role="search" action="search.html" class="navbar-form">
            <div class="form-group has-feedback">
               <input type="text" placeholder="Type and hit Enter.." class="form-control">
               <div data-toggle="navbar-search-dismiss" class="fa fa-times form-control-feedback"></div>
            </div>
            <button type="submit" class="hidden btn btn-default">Submit</button>
         </form>
         <!-- END Search form-->
      </nav>
      <!-- END Top Navbar-->
      <!-- START aside-->
      <aside class="aside">
         <!-- START Sidebar (left)-->
         <nav class="sidebar">
            <!-- START user info-->
            <div class="item user-block">
               <!-- User picture-->
               <div class="user-block-picture">
                  <div class="user-block-status">
                     <img src="app/img/user/02.jpg" alt="Avatar" width="60" height="60" class="img-thumbnail img-circle">
                     <div class="circle circle-success circle-lg"></div>
                  </div>
                  <!-- Status when collapsed-->
               </div>
               <!-- Name and Role-->
               <div class="user-block-info">
                  <span class="user-block-name item-text">Welcome User</span>
                  <span class="user-block-role">UX-Dev</span>
               </div>
            </div>
            <!-- END user info-->
            <ul class="nav">
               <!-- START Menu-->
               <li class="nav-heading">Main navigation</li>
               <li>
                  <a href="index.html" title="Dashboard" data-toggle="" class="no-submenu">
                     <em class="fa fa-dot-circle-o"></em>
                     <div class="label label-primary pull-right">10</div>
                     <span class="item-text">Dashboard</span>
                  </a>
               </li>
               <li class="active">
                  <a href="widgets.html" title="Widgets" data-toggle="" class="no-submenu">
                     <em class="fa fa-cube"></em>
                     <span class="item-text">Widgets</span>
                  </a>
               </li>
               <li>
                  <a href="widgets.html#" title="Elements" data-toggle="collapse-next" class="has-submenu">
                     <em class="fa fa-flask"></em>
                     <span class="item-text">Elements</span>
                  </a>
                  <!-- START SubMenu item-->
                  <ul class="nav collapse ">
                     <li>
                        <a href="button.html" title="Buttons" data-toggle="" class="no-submenu">
                           <span class="item-text">Buttons</span>
                        </a>
                     </li>
                     <li>
                        <a href="notifications.html" title="Notifications" data-toggle="" class="no-submenu">
                           <span class="item-text">Notifications</span>
                        </a>
                     </li>
                     <li>
                        <a href="spinners.html" title="Spinners" data-toggle="" class="no-submenu">
                           <span class="item-text">Spinners</span>
                        </a>
                     </li>
                     <li>
                        <a href="animations.html" title="Animations" data-toggle="" class="no-submenu">
                           <span class="item-text">Animations</span>
                        </a>
                     </li>
                     <li>
                        <a href="dropdown-animations.html" title="Dropdown" data-toggle="" class="no-submenu">
                           <span class="item-text">Dropdown</span>
                        </a>
                     </li>
                     <li>
                        <a href="panels.html" title="Panels" data-toggle="" class="no-submenu">
                           <span class="item-text">Panels</span>
                        </a>
                     </li>
                     <li>
                        <a href="portlets.html" title="Portlets" data-toggle="" class="no-submenu">
                           <span class="item-text">Portlets</span>
                        </a>
                     </li>
                     <li>
                        <a href="maps.html" title="Maps" data-toggle="" class="no-submenu">
                           <span class="item-text">Maps</span>
                        </a>
                     </li>
                     <li>
                        <a href="grid.html" title="Grid" data-toggle="" class="no-submenu">
                           <span class="item-text">Grid</span>
                        </a>
                     </li>
                     <li>
                        <a href="grid-masonry.html" title="Grid Masonry" data-toggle="" class="no-submenu">
                           <span class="item-text">Grid Masonry</span>
                        </a>
                     </li>
                     <li>
                        <a href="typo.html" title="Typography" data-toggle="" class="no-submenu">
                           <span class="item-text">Typography</span>
                        </a>
                     </li>
                     <li>
                        <a href="icons.html" title="Icons" data-toggle="" class="no-submenu">
                           <div class="label label-primary pull-right">+400</div>
                           <span class="item-text">Icons</span>
                        </a>
                     </li>
                  </ul>
                  <!-- END SubMenu item-->
               </li>
               <li>
                  <a href="widgets.html#" title="Forms" data-toggle="collapse-next" class="has-submenu">
                     <em class="fa fa-edit"></em>
                     <span class="item-text">Forms</span>
                  </a>
                  <!-- START SubMenu item-->
                  <ul class="nav collapse ">
                     <li>
                        <a href="form-standard.html" title="Standard" data-toggle="" class="no-submenu">
                           <span class="item-text">Standard</span>
                        </a>
                     </li>
                     <li>
                        <a href="form-extended.html" title="Extended" data-toggle="" class="no-submenu">
                           <span class="item-text">Extended</span>
                        </a>
                     </li>
                     <li>
                        <a href="form-validation.html" title="Validation" data-toggle="" class="no-submenu">
                           <span class="item-text">Validation</span>
                        </a>
                     </li>
                     <li>
                        <a href="form-wizard.html" title="Wizard" data-toggle="" class="no-submenu">
                           <span class="item-text">Wizard</span>
                        </a>
                     </li>
                  </ul>
                  <!-- END SubMenu item-->
               </li>
               <li>
                  <a href="widgets.html#" title="Charts" data-toggle="collapse-next" class="has-submenu">
                     <em class="fa fa-bar-chart-o"></em>
                     <span class="item-text">Charts</span>
                  </a>
                  <!-- START SubMenu item-->
                  <ul class="nav collapse ">
                     <li>
                        <a href="chart-flot.html" title="Flot" data-toggle="" class="no-submenu">
                           <span class="item-text">Flot</span>
                        </a>
                     </li>
                     <li>
                        <a href="chart-radial.html" title="Radial" data-toggle="" class="no-submenu">
                           <span class="item-text">Radial</span>
                        </a>
                     </li>
                  </ul>
                  <!-- END SubMenu item-->
               </li>
               <li>
                  <a href="widgets.html#" title="Tables" data-toggle="collapse-next" class="has-submenu">
                     <em class="fa fa-table"></em>
                     <span class="item-text">Tables</span>
                  </a>
                  <!-- START SubMenu item-->
                  <ul class="nav collapse ">
                     <li>
                        <a href="table-standard.html" title="Standard" data-toggle="" class="no-submenu">
                           <span class="item-text">Standard</span>
                        </a>
                     </li>
                     <li>
                        <a href="table-extended.html" title="Extended" data-toggle="" class="no-submenu">
                           <span class="item-text">Extended</span>
                        </a>
                     </li>
                     <li>
                        <a href="table-datatable.html" title="DataTables" data-toggle="" class="no-submenu">
                           <span class="item-text">DataTables</span>
                        </a>
                     </li>
                  </ul>
                  <!-- END SubMenu item-->
               </li>
               <li class="nav-heading">More elements</li>
               <li>
                  <a href="widgets.html#" title="Pages" data-toggle="collapse-next" class="has-submenu">
                     <em class="fa fa-file-text-o"></em>
                     <span class="item-text">Pages</span>
                  </a>
                  <!-- START SubMenu item-->
                  <ul class="nav collapse ">
                     <li>
                        <a href="pages/login.html" title="Login" data-toggle="" class="no-submenu">
                           <span class="item-text">Login</span>
                        </a>
                     </li>
                     <li>
                        <a href="pages/signup.html" title="Sign up" data-toggle="" class="no-submenu">
                           <span class="item-text">Sign up</span>
                        </a>
                     </li>
                     <li>
                        <a href="pages/recover.html" title="Recover Password" data-toggle="" class="no-submenu">
                           <span class="item-text">Recover Password</span>
                        </a>
                     </li>
                     <li>
                        <a href="pages/lock.html" title="Lock" data-toggle="" class="no-submenu">
                           <span class="item-text">Lock</span>
                        </a>
                     </li>
                     <li>
                        <a href="template.html" title="Starter Template" data-toggle="" class="no-submenu">
                           <span class="item-text">Starter Template</span>
                        </a>
                     </li>
                  </ul>
                  <!-- END SubMenu item-->
               </li>
               <li>
                  <a href="widgets.html#" title="Extras" data-toggle="collapse-next" class="has-submenu">
                     <em class="fa fa-plus"></em>
                     <span class="item-text">Extras</span>
                  </a>
                  <!-- START SubMenu item-->
                  <ul class="nav collapse ">
                     <li>
                        <a href="mailbox.html" title="Mailbox" data-toggle="" class="no-submenu">
                           <span class="item-text">Mailbox</span>
                        </a>
                     </li>
                     <li>
                        <a href="timeline.html" title="Timeline" data-toggle="" class="no-submenu">
                           <span class="item-text">Timeline</span>
                        </a>
                     </li>
                     <li>
                        <a href="calendar.html" title="Calendar" data-toggle="" class="no-submenu">
                           <span class="item-text">Calendar</span>
                        </a>
                     </li>
                     <li>
                        <a href="invoice.html" title="Invoice" data-toggle="" class="no-submenu">
                           <span class="item-text">Invoice</span>
                        </a>
                     </li>
                     <li>
                        <a href="search.html" title="Search" data-toggle="" class="no-submenu">
                           <span class="item-text">Search</span>
                        </a>
                     </li>
                  </ul>
                  <!-- END SubMenu item-->
               </li>
               <!-- START Theme color options-->
               <li>
                  <a href="widgets.html#" title="Color options" data-toggle="collapse-next" class="has-submenu">
                     <div class="label label-purple pull-right">4</div>
                     <em class="fa fa-tint"></em>
                     <span class="item-text">Colors</span>
                  </a>
                  <!-- START SubMenu item-->
                  <ul class="nav collapse">
                     <li>
                        <a href="widgets.html#" title="Option 1" data-toggle="load-css" data-uri="app/css/beadmin-theme-a.css" class="no-submenu">
                           <span class="item-text">Alternative 1</span>
                        </a>
                     </li>
                     <li>
                        <a href="widgets.html#" title="Option 2" data-toggle="load-css" data-uri="app/css/beadmin-theme-b.css" class="no-submenu">
                           <span class="item-text">Alternative 2</span>
                        </a>
                     </li>
                     <li>
                        <a href="widgets.html#" title="Option 3" data-toggle="load-css" data-uri="app/css/beadmin-theme-c.css" class="no-submenu">
                           <span class="item-text">Alternative 3</span>
                        </a>
                     </li>
                     <li>
                        <a href="widgets.html#" title="Option 4" data-toggle="load-css" data-uri="app/css/beadmin-theme-d.css" class="no-submenu">
                           <span class="item-text">Alternative 4</span>
                        </a>
                     </li>
                  </ul>
                  <!-- END SubMenu item-->
               </li>
               <!-- END Theme color options-->
               <li>
                  <ul class="nav-labels">
                     <li class="nav-heading">Categories</li>
                     <li class="nav-labels-item">
                        <span class="circle circle-lg circle-success"></span><a href="widgets.html#">Green</a>
                     </li>
                     <li class="nav-labels-item">
                        <span class="circle circle-lg circle-danger"></span><a href="widgets.html#">Red</a>
                     </li>
                     <li class="nav-labels-item">
                        <span class="circle circle-lg circle-info"></span><a href="widgets.html#">Skyblue</a>
                     </li>
                     <li class="nav-labels-item">
                        <span class="circle circle-lg circle-warning"></span><a href="widgets.html#">Yellow</a>
                     </li>
                  </ul>
               </li>
               <!-- END Menu-->
            </ul>
         </nav>
         <!-- END Sidebar (left)-->
      </aside>
      <!-- End aside-->
      <!-- START aside-->
      <aside class="offsidebar">
         <!-- START Off Sidebar (right)-->
         <nav>
            <div class="p-lg text-center">
               <em class="fa fa-user"></em>
               <strong>Connections</strong>
            </div>
            <ul class="nav">
               <!-- END user info-->
               <li class="p">
                  <div class="form-group has-feedback">
                     <input type="text" placeholder="Search contacts.." class="form-control input-sm">
                     <em class="fa fa-search form-control-feedback text-muted"></em>
                  </div>
               </li>
               <!-- START list title-->
               <li class="p">
                  <small class="text-muted">ONLINE</small>
               </li>
               <!-- END list title-->
               <li>
                  <!-- START User status-->
                  <a href="widgets.html#" class="media p mt0">
                     <span class="pull-right">
                        <span class="circle circle-success circle-lg"></span>
                     </span>
                     <span class="pull-left">
                        <!-- Contact avatar-->
                        <img src="app/img/user/05.jpg" alt="Image" class="media-object img-circle thumb32">
                     </span>
                     <!-- Contact info-->
                     <span class="media-body">
                        <span class="media-heading">
                           <strong>Laura Sam</strong>
                           <br>
                           <small class="text-muted">Lead, Developer</small>
                        </span>
                     </span>
                  </a>
                  <!-- END User status-->
                  <!-- START User status-->
                  <a href="widgets.html#" class="media p mt0">
                     <span class="pull-right">
                        <span class="circle circle-success circle-lg"></span>
                     </span>
                     <span class="pull-left">
                        <!-- Contact avatar-->
                        <img src="app/img/user/06.jpg" alt="Image" class="media-object img-circle thumb32">
                     </span>
                     <!-- Contact info-->
                     <span class="media-body">
                        <span class="media-heading">
                           <strong>Beverley Pierce</strong>
                           <br>
                           <small class="text-muted">Writer</small>
                        </span>
                     </span>
                  </a>
                  <!-- END User status-->
                  <!-- START User status-->
                  <a href="widgets.html#" class="media p mt0">
                     <span class="pull-right">
                        <span class="circle circle-danger circle-lg"></span>
                     </span>
                     <span class="pull-left">
                        <!-- Contact avatar-->
                        <img src="app/img/user/07.jpg" alt="Image" class="media-object img-circle thumb32">
                     </span>
                     <!-- Contact info-->
                     <span class="media-body">
                        <span class="media-heading">
                           <strong>Mika Long</strong>
                           <br>
                           <small class="text-muted">System Analyst</small>
                        </span>
                     </span>
                  </a>
                  <!-- END User status-->
                  <!-- START User status-->
                  <a href="widgets.html#" class="media p mt0">
                     <span class="pull-right">
                        <span class="circle circle-warning circle-lg"></span>
                     </span>
                     <span class="pull-left">
                        <!-- Contact avatar-->
                        <img src="app/img/user/08.jpg" alt="Image" class="media-object img-circle thumb32">
                     </span>
                     <!-- Contact info-->
                     <span class="media-body">
                        <span class="media-heading">
                           <strong>Danielle Berry</strong>
                           <br>
                           <small class="text-muted">Developer</small>
                        </span>
                     </span>
                  </a>
                  <!-- END User status-->
               </li>
               <!-- START list title-->
               <li class="p">
                  <small class="text-muted">OFFLINE</small>
               </li>
               <!-- END list title-->
               <li>
                  <!-- START User status-->
                  <a href="widgets.html#" class="media p mt0">
                     <span class="pull-right">
                        <span class="circle circle-lg"></span>
                     </span>
                     <span class="pull-left">
                        <!-- Contact avatar-->
                        <img src="app/img/user/09.jpg" alt="Image" class="media-object img-circle thumb32">
                     </span>
                     <!-- Contact info-->
                     <span class="media-body">
                        <span class="media-heading">
                           <strong>Martin Cooper</strong>
                           <br>
                           <small class="text-muted">Designeer</small>
                        </span>
                     </span>
                  </a>
                  <!-- END User status-->
                  <!-- START User status-->
                  <a href="widgets.html#" class="media p mt0">
                     <span class="pull-right">
                        <span class="circle circle-lg"></span>
                     </span>
                     <span class="pull-left">
                        <!-- Contact avatar-->
                        <img src="app/img/user/10.jpg" alt="Image" class="media-object img-circle thumb32">
                     </span>
                     <!-- Contact info-->
                     <span class="media-body">
                        <span class="media-heading">
                           <strong>Daniel Curtis</strong>
                           <br>
                           <small class="text-muted">Designer</small>
                        </span>
                     </span>
                  </a>
                  <!-- END User status-->
               </li>
               <li>
                  <div class="p-lg text-center">
                     <!-- Optional link to list more users-->
                     <a href="widgets.html#" title="See more contacts" class="btn btn-purple btn-sm">
                        <strong>Load more..</strong>
                     </a>
                  </div>
               </li>
            </ul>
            <!-- Extra items-->
            <div class="p">
               <p>
                  <small class="text-muted">Tasks completion</small>
               </p>
               <div class="progress progress-xs m0">
                  <div role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" class="progress-bar progress-bar-success progress-80">
                     <span class="sr-only">80% Complete</span>
                  </div>
               </div>
            </div>
            <div class="p">
               <p>
                  <small class="text-muted">Upload quota</small>
               </p>
               <div class="progress progress-xs m0">
                  <div role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" class="progress-bar progress-bar-warning progress-40">
                     <span class="sr-only">40% Complete</span>
                  </div>
               </div>
            </div>
         </nav>
         <!-- END Off Sidebar (right)-->
      </aside>
      <!-- END aside-->
      <!-- START Main section-->
      <section>
         <!-- START Page content-->
         <div class="content-wrapper">
            <h3>Widgets</h3>
            <!-- START row-->
            <div class="row">
               <div class="col-lg-3 col-md-6">
                  <!-- START panel-->
                  <div class="panel panel-primary">
                     <div class="panel-heading">
                        <div class="row">
                           <div class="col-xs-3">
                              <em class="fa fa-comments fa-5x"></em>
                           </div>
                           <div class="col-xs-9 text-right">
                              <div class="text-lg">26</div>
                              <p class="m0">New Comments!</p>
                           </div>
                        </div>
                     </div>
                     <a href="widgets.html#" class="panel-footer bg-dark bt0 clearfix btn-block">
                        <span class="pull-left">View Details</span>
                        <span class="pull-right">
                           <em class="fa fa-chevron-circle-right"></em>
                        </span>
                     </a>
                     <!-- END panel-->
                  </div>
               </div>
               <div class="col-lg-3 col-md-6">
                  <!-- START panel-->
                  <div class="panel panel-green">
                     <div class="panel-heading">
                        <div class="row">
                           <div class="col-xs-3">
                              <em class="fa fa-tasks fa-5x"></em>
                           </div>
                           <div class="col-xs-9 text-right">
                              <div class="text-lg">12</div>
                              <p class="m0">New Tasks!</p>
                           </div>
                        </div>
                     </div>
                     <a href="widgets.html#" class="panel-footer bg-dark bt0 clearfix btn-block">
                        <span class="pull-left">View Details</span>
                        <span class="pull-right">
                           <em class="fa fa-chevron-circle-right"></em>
                        </span>
                     </a>
                  </div>
                  <!-- END panel-->
               </div>
               <div class="col-lg-3 col-md-6">
                  <!-- START panel-->
                  <div class="panel panel-warning">
                     <div class="panel-heading">
                        <div class="row">
                           <div class="col-xs-3">
                              <em class="fa fa-shopping-cart fa-5x"></em>
                           </div>
                           <div class="col-xs-9 text-right">
                              <div class="text-lg">124</div>
                              <p class="m0">New Orders!</p>
                           </div>
                        </div>
                     </div>
                     <a href="widgets.html#" class="panel-footer bg-dark bt0 clearfix btn-block">
                        <span class="pull-left">View Details</span>
                        <span class="pull-right">
                           <em class="fa fa-chevron-circle-right"></em>
                        </span>
                     </a>
                  </div>
                  <!-- END panel-->
               </div>
               <div class="col-lg-3 col-md-6">
                  <!-- START panel-->
                  <div class="panel panel-danger">
                     <div class="panel-heading">
                        <div class="row">
                           <div class="col-xs-3">
                              <em class="fa fa-support fa-5x"></em>
                           </div>
                           <div class="col-xs-9 text-right">
                              <div class="text-lg">13</div>
                              <p class="m0">Support Tickets!</p>
                           </div>
                        </div>
                     </div>
                     <a href="widgets.html#" class="panel-footer bg-dark bt0 clearfix btn-block">
                        <span class="pull-left">View Details</span>
                        <span class="pull-right">
                           <em class="fa fa-chevron-circle-right"></em>
                        </span>
                     </a>
                  </div>
                  <!-- END panel-->
               </div>
            </div>
            <!-- END row-->
            <!-- START row-->
            <div class="row">
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="row row-table row-flush">
                        <div class="col-xs-6 bb br">
                           <div class="row row-table row-flush">
                              <div class="col-xs-4 text-center text-info">
                                 <em class="fa fa-users fa-2x"></em>
                              </div>
                              <div class="col-xs-8">
                                 <div class="panel-body text-center">
                                    <h4 class="mt0">10k</h4>
                                    <p class="mb0 text-muted">VISITORS</p>
                                 </div>
                              </div>
                           </div>
                        </div>
                        <div class="col-xs-6 bb">
                           <div class="row row-table row-flush">
                              <div class="col-xs-4 text-center text-danger">
                                 <em class="fa fa-music fa-2x"></em>
                              </div>
                              <div class="col-xs-8">
                                 <div class="panel-body text-center">
                                    <h4 class="mt0">100%</h4>
                                    <p class="mb0 text-muted">VOLUME</p>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="row row-table row-flush">
                        <div class="col-xs-6 br">
                           <div class="row row-table row-flush">
                              <div class="col-xs-4 text-center text-inverse">
                                 <em class="fa fa-code-fork fa-2x"></em>
                              </div>
                              <div class="col-xs-8">
                                 <div class="panel-body text-center">
                                    <h4 class="mt0">150</h4>
                                    <p class="mb0 text-muted">FORKS</p>
                                 </div>
                              </div>
                           </div>
                        </div>
                        <div class="col-xs-6">
                           <div class="row row-table row-flush">
                              <div class="col-xs-4 text-center text-success">
                                 <em class="fa fa-inbox fa-2x"></em>
                              </div>
                              <div class="col-xs-8">
                                 <div class="panel-body text-center">
                                    <h4 class="mt0">10</h4>
                                    <p class="mb0 text-muted">NEW MESSAGES</p>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="row row-table row-flush">
                        <div class="col-xs-6 bb br">
                           <div class="row row-table row-flush">
                              <div class="col-xs-4 text-center text-info">
                                 <!-- Bar chart-->
                                 <div data-bar-color="primary" data-height="20" data-bar-width="3" data-bar-spacing="2" class="inlinesparkline inline">5,9,4,1,3,4,7,5</div>
                              </div>
                              <div class="col-xs-8">
                                 <div class="panel-body text-center">
                                    <h4 class="mt0">10k</h4>
                                    <p class="mb0 text-muted">VISITORS</p>
                                 </div>
                              </div>
                           </div>
                        </div>
                        <div class="col-xs-6 bb">
                           <div class="row row-table row-flush">
                              <div class="col-xs-4 text-center text-danger">
                                 <!-- Bar chart-->
                                 <div data-bar-color="primary" data-height="20" data-bar-width="3" data-bar-spacing="2" class="inlinesparkline inline">1,2,3,4,5,6,7,8,9</div>
                              </div>
                              <div class="col-xs-8">
                                 <div class="panel-body text-center">
                                    <h4 class="mt0">100%</h4>
                                    <p class="mb0 text-muted">CONVERSIONS</p>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="row row-table row-flush">
                        <div class="col-xs-6 br">
                           <div class="row row-table row-flush">
                              <div class="col-xs-4 text-center text-inverse">
                                 <!-- Bar chart-->
                                 <div data-bar-color="primary" data-height="20" data-bar-width="3" data-bar-spacing="2" class="inlinesparkline inline">1,0,4,9,5,7,8,4,7</div>
                              </div>
                              <div class="col-xs-8">
                                 <div class="panel-body text-center">
                                    <h4 class="mt0">150</h4>
                                    <p class="mb0 text-muted">RETURNS</p>
                                 </div>
                              </div>
                           </div>
                        </div>
                        <div class="col-xs-6">
                           <div class="row row-table row-flush">
                              <div class="col-xs-4 text-center text-success">
                                 <!-- Bar chart-->
                                 <div data-bar-color="primary" data-height="20" data-bar-width="3" data-bar-spacing="2" class="inlinesparkline inline">1,5,2,2,8,4,4,8</div>
                              </div>
                              <div class="col-xs-8">
                                 <div class="panel-body text-center">
                                    <h4 class="mt0">10</h4>
                                    <p class="mb0 text-muted">UNIQUES</p>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="half-float">
                        <img src="app/img/bg3.jpg" alt="" class="img-responsive">
                        <div class="half-float-bottom">
                           <img src="app/img/user/09.jpg" alt="Image" class="img-thumbnail img-circle thumb128">
                        </div>
                     </div>
                     <div class="panel-body text-center">
                        <h3 class="m0">Laurie Nelson</h3>
                        <p class="text-muted">Lead director</p>
                        <p>Proin metus justo, commodo in ultrices at, lobortis sit amet dui. Fusce dolor purus, adipiscing a tempus at, gravida vel purus.</p>
                     </div>
                     <div class="panel-body text-center bg-gray-dark">
                        <div class="row row-table">
                           <div class="col-xs-4">
                              <h3 class="m0">400</h3>
                              <p class="m0">Photos</p>
                           </div>
                           <div class="col-xs-4">
                              <h3 class="m0">2000</h3>
                              <p class="m0">Likes</p>
                           </div>
                           <div class="col-xs-4">
                              <h3 class="m0">500</h3>
                              <p class="m0">Following</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div style="background-image: url('app/img/bg4.jpg')" class="panel-body text-center bg-center">
                        <div class="row row-table">
                           <div class="col-xs-12 text-white">
                              <img src="app/img/user/06.jpg" alt="Image" class="img-thumbnail img-circle thumb128">
                              <h3 class="m0">Soham</h3>
                              <p class="m0">
                                 <em class="fa fa-twitter fa-fw"></em>@soham</p>
                           </div>
                        </div>
                     </div>
                     <div class="panel-body text-center bg-gray-darker">
                        <div class="row row-table">
                           <div class="col-xs-4">
                              <a href="widgets.html#" class="text-white">
                                 <em class="fa fa-twitter fa-2x"></em>
                              </a>
                           </div>
                           <div class="col-xs-4">
                              <a href="widgets.html#" class="text-white">
                                 <em class="fa fa-facebook fa-2x"></em>
                              </a>
                           </div>
                           <div class="col-xs-4">
                              <a href="widgets.html#" class="text-white">
                                 <em class="fa fa-comments fa-2x"></em>
                              </a>
                           </div>
                        </div>
                     </div>
                     <div class="list-group">
                        <a href="widgets.html#" class="list-group-item">
                           <span class="label label-primary pull-right">15</span>
                           <em class="fa fa-fw fa-clock-o text-muted"></em>Recent Activity</a>
                        <a href="widgets.html#" class="list-group-item">
                           <span class="label label-primary pull-right">100</span>
                           <em class="fa fa-fw fa-user text-muted"></em>Following</a>
                        <a href="widgets.html#" class="list-group-item">
                           <span class="label label-primary pull-right">300</span>
                           <em class="fa fa-fw fa-folder-open-o text-muted"></em>Photos</a>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
            </div>
            <!-- END row-->
            <!-- START row-->
            <div class="row">
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="panel-body bg-success">
                        <div class="h5 mt0">Received all time</div>
                        <!-- Line chart-->
                        <span data-type="line" data-height="80" data-width="100%" data-line-width="2" data-line-color="#dddddd" data-spot-color="#bbbbbb" data-fill-color="" data-highlight-line-color="#fff" data-spot-radius="3" data-resize="true" class="inlinesparkline sparkline">
                           <!-- 1,3,4,7,5,9,4,4,7,5,9,6,4-->
                        </span>
                        <!-- Bar chart-->
                        <div class="text-center">
                           <div data-bar-color="#fff" data-height="50" data-bar-width="6" data-bar-spacing="6" class="inlinesparkline inline">1,3,4,7,5,9,4,4,7,5,9,6,4</div>
                        </div>
                     </div>
                     <div class="panel-body bg-inverse">
                        <div class="row row-table text-center">
                           <div class="col-xs-4">
                              <p class="m0 h3">15080</p>
                              <p class="m0 text-muted">Shot Views</p>
                           </div>
                           <div class="col-xs-4">
                              <p class="m0 h3">12000</p>
                              <p class="m0 text-muted">Likes</p>
                           </div>
                           <div class="col-xs-4">
                              <p class="m0 h3">5100</p>
                              <p class="m0 text-muted">Comments</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="panel-body bg-primary">
                        <div class="h5 mt0">Monthly incomes</div>
                        <!-- Line chart-->
                        <div data-type="line" data-height="80" data-width="100%" data-line-width="2" data-line-color="#dddddd" data-spot-color="#bbbbbb" data-fill-color="" data-highlight-line-color="#fff" data-spot-radius="3" data-resize="true" class="inlinesparkline sparkline">
                           <!-- 1,3,4,7,5,9,4,4,7,5,9,6,4-->
                        </div>
                     </div>
                     <div class="panel-body bg-inverse">
                        <div class="row text-center">
                           <div class="col-xs-6">
                              <!-- Bar chart-->
                              <div data-bar-color="primary" data-height="30" data-bar-width="6" data-bar-spacing="6" class="inlinesparkline inline">1,3,4,7,5,9,4,4,7,5,9,6,4</div>
                           </div>
                           <div class="col-xs-6">
                              <h4 class="m0">+150</h4>
                              <p class="m0 text-muted">
                                 <small>From last month</small>
                              </p>
                           </div>
                        </div>
                     </div>
                     <div class="panel-body">
                        <div class="row row-table text-center">
                           <div class="col-xs-6">
                              <div class="p">
                                 <p class="m0 text-muted">Gross income</p>
                                 <h4 class="m0">12000</h4>
                              </div>
                           </div>
                           <div class="col-xs-6">
                              <div class="p">
                                 <p class="m0 text-muted">Net income</p>
                                 <h4 class="m0">5100</h4>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="row row-table row-flush">
                        <div class="col-xs-8">
                           <img src="app/img/bg1.jpg" alt="" class="img-responsive">
                        </div>
                        <div class="col-xs-4 align-middle bg-info">
                           <div class="text-center">
                              <div class="text-lg mt0">11&deg;</div>
                              <p>Cold</p>
                              <em class="fa fa-sun-o fa-2x"></em>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
            </div>
            <!-- END row-->
            <!-- START row-->
            <div class="row">
               <div class="col-lg-3">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="row row-table row-flush">
                        <div class="col-xs-4 bg-info text-center">
                           <em class="fa fa-users fa-2x"></em>
                        </div>
                        <div class="col-xs-8">
                           <div class="panel-body text-center">
                              <h4 class="mt0">10k</h4>
                              <p class="mb0 text-muted">VISITORS</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-3">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="row row-table row-flush">
                        <div class="col-xs-4 bg-danger text-center">
                           <em class="fa fa-music fa-2x"></em>
                        </div>
                        <div class="col-xs-8">
                           <div class="panel-body text-center">
                              <h4 class="mt0">100%</h4>
                              <p class="mb0 text-muted">VOLUME</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-3">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="row row-table row-flush">
                        <div class="col-xs-4 bg-inverse text-center">
                           <em class="fa fa-code-fork fa-2x"></em>
                        </div>
                        <div class="col-xs-8">
                           <div class="panel-body text-center">
                              <h4 class="mt0">150</h4>
                              <p class="mb0 text-muted">FORKS</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-3">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="row row-table row-flush">
                        <div class="col-xs-4 bg-green text-center">
                           <em class="fa fa-inbox fa-2x"></em>
                        </div>
                        <div class="col-xs-8">
                           <div class="panel-body text-center">
                              <h4 class="mt0">10</h4>
                              <p class="mb0 text-muted">NEW MESSAGES</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
            </div>
            <!-- END row-->
            <!-- START row-->
            <div class="row">
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="row row-table row-flush">
                        <div class="col-xs-5">
                           <picture class="lateral-picture">
                              <img src="app/img/bg2.jpg" alt="">
                           </picture>
                        </div>
                        <div class="col-xs-7 align-middle p-lg">
                           <div class="pull-right"><a href="widgets.html#" class="btn btn-primary btn-sm">Register</a>
                           </div>
                           <p>
                              <span class="text-lg">16</span>Aug</p>
                           <p>
                              <strong>EVENT INVITATION</strong>
                           </p>
                           <p>Donec posuere neque in elit luctus tempor consequat enim egestas. Nulla dictum egestas leo at lobortis.</p>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="panel-body bg-danger text-center">
                        <div class="clearfix">
                           <div class="pull-left">200 Following</div>
                           <div class="pull-right">150 Followers</div>
                        </div>
                        <img src="app/img/user/06.jpg" alt="Image" class="img-thumbnail img-circle thumb96">
                        <h4 class="mt0">Olivia Ford</h4>
                        <p class="m0">
                           <em class="fa fa-fw fa-map-marker"></em>San Francisco, California</p>
                        <div class="clearfix">
                           <div class="pull-left">15k Likes</div>
                           <div class="pull-right">100 Feeds</div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div data-zoom="14" data-address="276 N TUSTIN ST, ORANGE, CA 92867" data-toggle="gmap" class="gmap gmap-sm"></div>
                     <div class="panel-body bg-inverse">
                        <div class="row row-table">
                           <div class="col-xs-6">
                              <div class="h2 m0">Find Us!</div>
                           </div>
                           <div class="col-xs-1">
                              <em class="fa fa-map-marker fa-3x"></em>
                           </div>
                           <div class="col-xs-5">
                              <p class="m0">Street 123</p>
                              <p class="m0">Location, Unknow</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
            </div>
            <!-- END row-->
            <!-- START row-->
            <div class="row">
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <img src="app/img/bg1.jpg" alt="Image" class="img-responsive">
                     <div class="panel-body">
                        <div class="row row-table text-center">
                           <div class="col-xs-4">
                              <p>Comments</p>
                              <h3 class="m0 text-primary">700</h3>
                           </div>
                           <div class="col-xs-4">
                              <p>Likes</p>
                              <h3 class="m0 text-primary">1500</h3>
                           </div>
                           <div class="col-xs-4">
                              <p>Shots</p>
                              <h3 class="m0 text-primary">300</h3>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-4">
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="panel-body">
                        <div class="media p mt0">
                           <div class="pull-left">
                              <img src="app/img/user/09.jpg" alt="Image" class="media-object img-circle thumb96">
                           </div>
                           <div class="media-body">
                              <div class="media-heading">
                                 <h3 class="mt0">Jack Ortiz</h3>
                                 <ul class="list-unstyled">
                                    <li class="mb-sm">
                                       <em class="fa fa-map-marker fa-fw"></em>ASD, Qwerty</li>
                                    <li class="mb-sm">
                                       <em class="fa fa-twitter fa-fw"></em>@asdasd</li>
                                    <li class="mb-sm">
                                       <em class="fa fa-envelope fa-fw"></em>asdasd@mail.com</li>
                                 </ul>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="panel-body bg-inverse">
                        <div class="row row-table text-center">
                           <div class="col-xs-4">
                              <p class="m0 h3">700</p>
                              <p class="m0 text-muted">Followers</p>
                           </div>
                           <div class="col-xs-4">
                              <p class="m0 h3">1500</p>
                              <p class="m0 text-muted">Following</p>
                           </div>
                           <div class="col-xs-4">
                              <p class="m0 h3">510</p>
                              <p class="m0 text-muted">Loved</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="panel-body">
                        <div class="row row-table">
                           <div class="col-xs-4 text-center">
                              <img src="app/img/user/06.jpg" alt="Image" class="img-thumbnail img-circle img-responsive thumb96">
                           </div>
                           <div class="col-xs-8">
                              <div class="pull-right"><a href="widgets.html#" class="btn btn-success">Follow</a>
                              </div>
                              <h3 class="mt0">Gwendolyn Price</h3>
                              <p class="text-muted">150 Following / 100 Followers</p>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
               <div class="col-lg-4">
                  <div class="row">
                     <div class="col-sm-6">
                        <!-- START widget-->
                        <div class="panel widget">
                           <div class="panel-body bg-info text-center">
                              <div class="text-lg m0">300</div>
                              <p>Re-Tweets</p>
                              <div class="mb-lg"></div>
                              <em class="fa fa-twitter text-alpha"></em>
                           </div>
                        </div>
                        <!-- END widget-->
                     </div>
                     <div class="col-sm-6">
                        <!-- START widget-->
                        <div class="panel widget">
                           <div class="panel-body bg-primary text-center">
                              <div class="text-lg m0">12&deg;</div>
                              <p>Bariloche</p>
                              <div class="mb-lg"></div>
                              <em class="fa fa-sun-o"></em>
                           </div>
                        </div>
                        <!-- END widget-->
                     </div>
                  </div>
                  <div class="row">
                     <div class="col-sm-6">
                        <!-- START widget-->
                        <div class="panel widget">
                           <div class="panel-body bg-danger text-center">
                              <div class="radial-bar radial-bar-40 radial-bar radial-bar-danger m0">
                                 <img src="app/img/user/03.jpg" alt="">
                              </div>
                              <p>
                                 <strong>40%</strong>
                                 <span>complete</span>
                              </p>
                           </div>
                        </div>
                        <!-- END widget-->
                     </div>
                     <div class="col-sm-6">
                        <!-- START widget-->
                        <div class="panel widget">
                           <div class="panel-body bg-purple text-center">
                              <p>
                                 <img src="app/img/user/08.jpg" alt="" class="img-rounded thumb64">
                              </p>
                              <p>
                                 <strong>Charlie Warren</strong>
                                 <span>is now following you</span>
                              </p>
                           </div>
                        </div>
                        <!-- END widget-->
                     </div>
                  </div>
                  <div class="row"></div>
                  <!-- START widget-->
                  <div class="panel widget">
                     <div class="panel-body">
                        <div class="row row-table">
                           <div class="col-xs-3 text-center">
                              <img src="app/img/user/06.jpg" alt="Image" class="img-thumbnail img-circle img-responsive thumb64">
                           </div>
                           <div class="col-xs-5 text-center">
                              <h3 class="m0">Liam Reid</h3>
                           </div>
                           <div class="col-xs-4">
                              <a href="widgets.html#" class="btn btn-purple">
                                 <em class="fa fa-hand-o-right"></em>
                                 <span>Touch</span>
                              </a>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- END widget-->
               </div>
            </div>
            <!-- END row-->
            <!-- START row-->
            <div class="row">
               <div class="col-md-6">
                  <!-- START panel-->
                  <div class="panel panel-default">
                     <div class="panel-heading">
                        <h3 class="panel-title">
                           <em class="fa fa-clock-o fa-fw"></em>Tasks Panel</h3>
                     </div>
                     <div class="panel-body">
                        <!-- START list group-->
                        <div class="list-group">
                           <a href="widgets.html#" class="list-group-item">
                              <span class="label label-purple pull-right">just now</span>
                              <em class="fa fa-fw fa-calendar mr"></em>Calendar updated</a>
                           <a href="widgets.html#" class="list-group-item">
                              <span class="label label-purple pull-right">4 minutes ago</span>
                              <em class="fa fa-fw fa-comment mr"></em>Commented on a post</a>
                           <a href="widgets.html#" class="list-group-item">
                              <span class="label label-purple pull-right">23 minutes ago</span>
                              <em class="fa fa-fw fa-truck mr"></em>Order 392 shipped</a>
                           <a href="widgets.html#" class="list-group-item">
                              <span class="label label-purple pull-right">46 minutes ago</span>
                              <em class="fa fa-fw fa-money mr"></em>Invoice 653 has been paid</a>
                           <a href="widgets.html#" class="list-group-item">
                              <span class="label label-purple pull-right">1 hour ago</span>
                              <em class="fa fa-fw fa-user mr"></em>A new user has been added</a>
                           <a href="widgets.html#" class="list-group-item">
                              <span class="label label-purple pull-right">2 hours ago</span>
                              <em class="fa fa-fw fa-check mr"></em>Completed task: "pick up dry cleaning"</a>
                           <a href="widgets.html#" class="list-group-item">
                              <span class="label label-purple pull-right">yesterday</span>
                              <em class="fa fa-fw fa-globe mr"></em>Saved the world</a>
                           <a href="widgets.html#" class="list-group-item">
                              <span class="label label-purple pull-right">two days ago</span>
                              <em class="fa fa-fw fa-check mr"></em>Completed task: "fix error on sales page"</a>
                        </div>
                        <!-- END list group-->
                     </div>
                     <div class="panel-footer text-right"><a href="widgets.html#" class="btn btn-default btn-sm">View All Activity </a>
                     </div>
                  </div>
                  <!-- END panel-->
               </div>
               <div class="col-md-6">
                  <!-- START panel-->
                  <div class="panel panel-default">
                     <div class="panel-heading">
                        <h3 class="panel-title">
                           <em class="fa fa-money fa-fw"></em>Transactions Panel</h3>
                     </div>
                     <div class="panel-body">
                        <!-- START table responsive-->
                        <div class="table-responsive">
                           <table class="table table-bordered table-hover table-striped">
                              <thead>
                                 <tr>
                                    <th>Order #</th>
                                    <th>Order Date</th>
                                    <th>Order Time</th>
                                    <th>Amount (USD)</th>
                                 </tr>
                              </thead>
                              <tbody>
                                 <tr>
                                    <td>3326</td>
                                    <td>10/21/2013</td>
                                    <td>3:29 PM</td>
                                    <td>$321.33</td>
                                 </tr>
                                 <tr>
                                    <td>3325</td>
                                    <td>10/21/2013</td>
                                    <td>3:20 PM</td>
                                    <td>$234.34</td>
                                 </tr>
                                 <tr>
                                    <td>3324</td>
                                    <td>10/21/2013</td>
                                    <td>3:03 PM</td>
                                    <td>$724.17</td>
                                 </tr>
                                 <tr>
                                    <td>3323</td>
                                    <td>10/21/2013</td>
                                    <td>3:00 PM</td>
                                    <td>$23.71</td>
                                 </tr>
                                 <tr>
                                    <td>3322</td>
                                    <td>10/21/2013</td>
                                    <td>2:49 PM</td>
                                    <td>$8345.23</td>
                                 </tr>
                                 <tr>
                                    <td>3321</td>
                                    <td>10/21/2013</td>
                                    <td>2:23 PM</td>
                                    <td>$245.12</td>
                                 </tr>
                                 <tr>
                                    <td>3320</td>
                                    <td>10/21/2013</td>
                                    <td>2:15 PM</td>
                                    <td>$5663.54</td>
                                 </tr>
                                 <tr>
                                    <td>3319</td>
                                    <td>10/21/2013</td>
                                    <td>2:13 PM</td>
                                    <td>$943.45</td>
                                 </tr>
                              </tbody>
                           </table>
                        </div>
                        <!-- END table responsive-->
                     </div>
                     <div class="panel-footer text-right"><a href="widgets.html#" class="btn btn-default btn-sm">View All Transactions</a>
                     </div>
                  </div>
                  <!-- END panel-->
               </div>
            </div>
            <!-- END row-->
         </div>
         <!-- END Page content-->
      </section>
      <!-- END Main section-->
   </div>
   <!-- END Main wrapper-->
   <!-- START Scripts-->
   <!-- Main vendor Scripts-->
   <script src="vendor/jquery/jquery.min.js"></script>
   <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
   <!-- Plugins-->
   <script src="vendor/chosen/chosen.jquery.min.js"></script>
   <script src="vendor/slider/js/bootstrap-slider.js"></script>
   <script src="vendor/filestyle/bootstrap-filestyle.min.js"></script>
   <!-- Animo-->
   <script src="vendor/animo/animo.min.js"></script>
   <!-- Sparklines-->
   <script src="vendor/sparklines/jquery.sparkline.min.js"></script>
   <!-- Slimscroll-->
   <script src="vendor/slimscroll/jquery.slimscroll.min.js"></script>
   <!-- Store + JSON-->
   <script src="vendor/store/store+json2.min.js"></script>
   <!-- ScreenFull-->
   <script src="vendor/screenfull/screenfull.min.js"></script>
   <!-- START Page Custom Script-->
   <!-- Gmap-->
   <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
   <script src="vendor/gmap/jquery.gmap.min.js"></script>
   <!-- END Page Custom Script-->
   <!-- App Main-->
   <script src="app/js/app.js"></script>
   <!-- END Scripts-->
</body>

</html>